<template>
  <div class="box">
    <div class="title">
      <div class>
        <span>复垦协议签订时间：</span>2018年7月1日 10时38分
      </div>
      <div class="title_two">
        <span>复垦协议签订位置：</span>
        <el-input value="重庆市荣昌区国土局" disabled></el-input>
      </div>
    </div>
    <div class="table">
        <el-table :data="tableData" style="width: 100%">
            <el-table-column type="index" show-overflow-tooltip label="序号"></el-table-column>
            <el-table-column prop="place" label="现场照片" ></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" type="primary" @click="btn_see(scope.row.imgName,scope.row.imgPath)">查看</el-button>
                </template>
          </el-table-column>
        </el-table>
    </div>

    <el-dialog :title="title" :visible.sync="seeImgDialog" width="50%">
      <div class="seeImg">
        <img src="../../../assets/mapText.png" width="80%" height="400">
        <!-- <img :src="imgPath" width="80%" height="500"> -->
      </div>
      
    </el-dialog>
  </div>
</template>

<script>
import {supervisingInfo} from '@/api/fkEntrust'

export default {
      data() {
        return {
          tableData: [],
          title:'',
          seeImgDialog:false,
          needInfo:{
            page:1,
            size:10,
          },
          total:0,
        }
      },
      mounted(){
        this.getData()
      },
      methods:{
          getData(){
            var data={}
            var objArr=this.needInfo
            for (var index in objArr) {
              if(objArr[index]!=''&&objArr[index]!=null){
                data[index]=objArr[index];
              }
            }
            data["projectId"]=localStorage.getItem("projectId")
            supervisingInfo(data).then(res=>{
              console.log(res)
              this.tableData=res.data.rows
              this.total=res.data.total
            })
          },
          btn_see(name,path){
              console.log(name,path)
              this.title=name
              this.seeImgDialog=true
          }
      },
    }
</script>

<style scoped>
* {
  box-sizing: border-box;
}
.box {
  padding: 30px;
}
.title {
  display: flex;
  font-size: 14px;
  color: #666;
  align-items: center;
  margin-bottom:20px ;
}
.title span {
  color: #444444;
  font-weight: bold;
}
.title_two {
  margin-left: 40px;
  display: flex;
  align-items: center;
}
.title_two span {
  width: 200px;
}
.seeImg{
    text-align: center;
}
</style>